import { Button, TextField, TreeItem, TreeView } from "@microsoft/fast-components";
import { EditorHost } from "./EditorHost";
import type { GameObjectInfo } from '../src/types'
import { InspectorPanel } from "./InspectorPanel";


export class HierarchyTree {

    private treeNode: TreeView
    private addGameObjectButton: Button
    private deleteGameObjectButton: Button
    private upMoveGameObjectButton: Button
    private downMoveGameObjectButton: Button
    
    constructor(private editorHost: EditorHost, private inspectorPanel: InspectorPanel) {
        this.treeNode = document.getElementById('hierarchy-tree') as TreeView;
        this.addGameObjectButton = document.getElementById('add-gameobject-button') as Button;
        this.deleteGameObjectButton = document.getElementById('delete-gameobject-button') as Button;
        this.upMoveGameObjectButton = document.getElementById("up-move-game-object-button")as Button;
        this.downMoveGameObjectButton = document.getElementById("down-move-game-object-button")as Button;
    }

    async start(inspectorPanel: InspectorPanel) {
        const gameObjects = await this.editorHost.execute('getAllGameObjects', null);
        function createTreeItem(container: HTMLElement, info: GameObjectInfo, editorHost: EditorHost) {
            const treeItem = new TreeItem();
            treeItem.addEventListener('click', (e) => {
                console.log('点击了' + info.name, info.uuid)
                inspectorPanel.onSelectGameObject(info.uuid);
                e.stopPropagation();
            })
            treeItem.innerText = info.name;
            container.appendChild(treeItem);
            const gameObjectChildren = info.children || [];
            for (const child of gameObjectChildren) {
                createTreeItem(treeItem, child, editorHost)
            }
        }

        for (const gameObject of gameObjects) {
            createTreeItem(this.treeNode, gameObject, this.editorHost);
        }

        //创建GameObject按钮
        this.addGameObjectButton.onclick = async () => {
            const parentUUID = inspectorPanel.selectedGameObjectUUID;
            await this.editorHost.execute('createNewGameObject', parentUUID);
            location.reload();
        }
        //删除GameObject按钮
        this.deleteGameObjectButton.onclick = async () => {
            const parentUUID = inspectorPanel.selectedGameObjectUUID;
            console.log("删除GameObject:", parentUUID);
            await this.editorHost.execute("deleteGameObject", parentUUID);
            location.reload();
        
        }
        //上移下移按钮

        this.upMoveGameObjectButton.onclick = async () => {
            const gameObjectUUID = inspectorPanel.selectedGameObjectUUID;
            await this.editorHost.execute("upMoveGameObjectByGameObjectUUID", gameObjectUUID);
            location.reload();
        }
        this.downMoveGameObjectButton.onclick = async () => {
            const gameObjectUUID = inspectorPanel.selectedGameObjectUUID;
            await this.editorHost.execute("downMoveGameObjectByGameObjectUUID", gameObjectUUID);
            location.reload();
        }
    }

    async updateView() {
        this.treeNode.innerHTML = ''
        const gameObjects = await this.editorHost.execute('getAllGameObjects', null);
        const inspectorPanel = this.inspectorPanel;
        function createTreeItem(container: HTMLElement, info: GameObjectInfo) {
            const treeItem = new TreeItem();
            treeItem.addEventListener('click', (e) => {
                console.log('点击了' + info.name, info.uuid)
                inspectorPanel.onSelectGameObject(info.uuid);
                e.stopPropagation();
            })
            treeItem.innerText = info.name;
            container.appendChild(treeItem);
            const gameObjectChildren = info.children || [];
            for (const child of gameObjectChildren) {
                createTreeItem(treeItem, child)
            }
        }

        for (const gameObject of gameObjects) {
            createTreeItem(this.treeNode, gameObject);
        }

        //创建GameObject按钮
        this.addGameObjectButton.onclick = async () => {
            const parentUUID = inspectorPanel.selectedGameObjectUUID;
            await this.editorHost.execute('createNewGameObject', parentUUID);
            location.reload();
        }
        //删除GameObject按钮
        this.deleteGameObjectButton.onclick = async () => {
            const parentUUID = inspectorPanel.selectedGameObjectUUID;
            console.log("删除GameObject:", parentUUID);
            await this.editorHost.execute("deleteGameObject", parentUUID);
            location.reload();
        
        }
        //上移下移按钮
    
        this.upMoveGameObjectButton.onclick = async () => {
            const gameObjectUUID = inspectorPanel.selectedGameObjectUUID;
            await this.editorHost.execute("upMoveGameObjectByGameObjectUUID", gameObjectUUID);
            location.reload();
        }
        this.downMoveGameObjectButton.onclick = async () => {
            const gameObjectUUID = inspectorPanel.selectedGameObjectUUID;
            await this.editorHost.execute("downMoveGameObjectByGameObjectUUID", gameObjectUUID);
            location.reload();
        }
    }


}

